 html, body {
     font-family: verdana, "Microsoft Yahei";
     width: 100%;
     height: 100%;
     padding: 0;
     margin: 0;
 }
 body {
     background-color: #292931;
     background-image: -webkit-radial-gradient(contain, #292931, #292931 20%, #32323A);
     background-image: -ms-radial-gradient(contain, #292931, #292931 20%, #32323A);
     position: relative;
 }
 footer {
     position: absolute;
     bottom: 0;
     text-align: center;
     left: 0;
     right: 0;
     padding: 10px 0;
     color: #aaa;
     font-size: 12px;
     letter-spacing: 2px;
 }
 #register-container, #login-container {
     min-width: 450px;
     position: absolute;
     top: 27%;
     left: 50%;
     padding: 0 50px;
     transform: translate(-50%, -50%);
     -webkit-transform: translate(-50%, -50%);
 }
 .shake {
     animation: shake 0.8s linear 0 infinite alternate;
     -webkit-animation: shake 0.8s linear 0;
     animation-fill-mode: forwards;
     -webkit-animation-fill-mode: forwards;
 }
 #sgidi {
     font-size: 60px;
     color: #f7f7f7;
     padding: 10px;
     text-align: center;
     letter-spacing: 4px;
     font-weight: bolder;
 }
 input {
     border: none;
 }
 .divider {
     background-color: #000;
     height: 2px;
     border-bottom: 1px solid #5B5B66;
     margin: 20px 11px 10px 11px;
     box-sizing: border-box;
     box-sizing: ms-border-box;
 }
 .form-wrapper {
     position: absolute;
     padding: 20px 0 40px 0;
     border-radius: 2px;
     left: 45%;
     min-width: 450px;
     transform: translate(-50%, 0);
     -webkit-transform: translate(-50%, 0);
 }
 .decorator {
     height: 6px;
     background-color: #C8E84A;
     background-image: -webkit-linear-gradient(left, #A769AA, #D1EC68 15%, #8FC536 30%, #9BA6C6 50%, #DB3370 75%, #B14995);
     background-image: linear-gradient(left, #A769AA, #D1EC68 15%, #8FC536 30%, #9BA6C6 50%, #DB3370 75%, #B14995);
 }
 form {
     padding: 6px 20px;
     display: block;
     width: 100%;
 }
 .input-section {
     display: block;
     padding: 10px;
     margin: 10px 0;
     font-size: 14px;
     color: #CDCDCD;
 }
 .input-section label {
     width: 80px;
     text-align: right;
     display: inline-block;
 }
 .input-section input {
     width: 60%;
     max-width: 350px;
     margin-left: 10px;
     padding: 10px;
     display: inline-block;
     border-radius: 2px;
     font-family: verdana, "Microsoft Yahei";
 }
 .input-section select {
     width: 65%;
     max-width: 350px;
     margin-left: 10px;
     padding: 9px;
     display: inline-block;
     border-radius: 2px;
     font-family: verdana, "Microsoft Yahei";
 }
 option {
     font-family: verdana, "Microsoft Yahei";
     padding: 10px;
 }
 .submit-btn {
     padding: 8px 0;
     background-color: #33968F;
     border-radius: 2px;
     max-width: 150px !important;
     font-family: verdana, "Microsoft Yahei";
     letter-spacing: 3px;
     cursor: pointer;
     color: #fff;
 }
 .submit-btn.finish {
     background-color: #5F8820;
     color: #f1f1f1;
 }
 .submit-btn.finish:hover {
     background-color: #76AA28;
 }
 .submit-btn.next {
     background-color: #0B6F8C;
     color: #f1f1f1;
 }
 .submit-btn.next:hover {
     background-color: #0A5C74;
 }
 .submit-btn:focus {
     outline: -webkit-focus-ring-color auto 0;
 }
 .submit-btn:hover {
     background-color: #2B7D77;
 }
 .link-btn {
     font-size: 13px;
     margin-left: 44px;
     color: #C58A2E;
 }
 .link-btn:hover {
     color: #D9A85E;
 }
 .register-btn {
     font-size: 13px;
     margin-left: 44px;
     color: #E13370;
 }
 .register-btn:hover {
     color: #E75C8D;
 }
 .fa.fa-check {
     margin-left: 10px;
     color: #42D746;
 }
 .fa.fa-times {
     margin-left: 10px;
     color: #EE2B61;
 }
 @keyframes shake {
     0% {
         margin-left: 0;
     }
     17% {
         margin-left: 10px;
     }
     34% {
         margin-left: -8px;
     }
     51% {
         margin-left: 7px;
     }
     68% {
         margin-left: -5px;
     }
     85% {
         margin-left: 4px;
     }
     100% {
         margin-left: 0;
     }
 }
 @-webkit-keyframes shake {
     0% {
         margin-left: 0;
     }
     17% {
         margin-left: 10px;
     }
     34% {
         margin-left: -10px;
     }
     51% {
         margin-left: 8px;
     }
     68% {
         margin-left: -6px;
     }
     85% {
         margin-left: 4px;
     }
     100% {
         margin-left: 0;
     }
 }
